import { useStore } from '@/store'

export default function UserInfo() {
  const { isLogin, role } = useStore((s) => ({
    isLogin: s.isLogin,
    role: s.role
  }))
  
  if (!isLogin) {
    return (
      <div className="p-4 bg-yellow-50 rounded border border-yellow-200">
        <p className="text-yellow-800">请先登录查看用户信息</p>
      </div>
    )
  }
  
  return (
    <div className="space-y-4">
      <div>
        <label className="block text-sm font-medium text-gray-700">登录状态</label>
        <p className="mt-1 text-lg">
          <span className="text-green-600">已登录</span>
        </p>
      </div>
      
      <div>
        <label className="block text-sm font-medium text-gray-700">用户角色</label>
        <p className="mt-1 text-lg text-blue-600">{role}</p>
      </div>
    </div>
  )
} 